<template>
  <el-container style="height: 100%; width: 100%">
    <Header />
    <el-main>
      <div class="banner">
        <img class="banner_bg" src="" alt />

        <div class="customer_banner_wrap">
          <MaskContent
            title="供应链金融业务系统"
            content="翔盛悦供应链金融系统可针对产业链上下游企业之间贸易过程中产生的物流、资金流和信息流的封闭式管理模式，设置了包括金融服务网络、额度管理、业务管理、融资台账、存货管理、仓单管理和应收账款、订单融资与组合产品融资等丰富的管理功能。另外，针对供应链金融业务创新频率高的特点，本系统提供了包括业务参数设置、业务规则设置、业务模型配置和审批流程配置在内的一系列配置化工具，能够做到针对金融机构使用人员的“零代码”设置实现业务扩展。"
          />
        </div>
      </div>

      <system-introduce :systemData="systemData" :introduceImg="introduceImg" />

      <div class="system-overview_wrapper">
        <custom-caption class="customer_caption" title="系统截图" content="" />
        <system-overview :systemImgData="systemImgData" />
      </div>

      <Footer />
    </el-main>
  </el-container>
</template>

<script>
import Header from "../../components/header/Header";
import MaskContent from "../../components/MaskContent";
import SystemIntroduce from "./components/systemIntroduce";
import CustomCaption from "../../components/CustomCaption";
import SystemOverview from "./components/systemOverview";
import Footer from "../../components/footer/Footer";

export default {
  name: "onlineCarRental",
  components: {
    Header,
    MaskContent,
    SystemIntroduce,
    CustomCaption,
    SystemOverview,
    Footer
  },
  data() {
    return {
      systemData: [
        {
          functionsName: "系统特色",
          functionsDes: [
            "系统特色方面，翔盛悦供应链金融业务系统X单脱胎于票据（可转可融），优于票据（可拆可赎回可延期），是债权的确认和转让。平台可通过X单为抓手，通过核心企业汇聚1-N层供应商，引入银行等外部金融机构，构成完整生态圈的线上平台。核心企业可实现金融收益交叉补贴，合作伙伴粘性、企业商业信用同步增强；\n          供应链企业可低成本、低门槛、便捷式实现融资操作。"
          ]
        }
      ],
      introduceImg: require("../../assets/image/supplyChainFinance1/Real.png"),
      systemImgData: [
        {
          imgUrl: require("../../assets/image/supplyChainFinance1/供应链系统_1.png")
        },
        {
          imgUrl: require("../../assets/image/supplyChainFinance1/供应链系统_2.png")
        },
        {
          imgUrl: require("../../assets/image/supplyChainFinance1/供应链系统_3.png")
        },
        {
          imgUrl: require("../../assets/image/supplyChainFinance1/供应链系统_4.png")
        }
      ]
    };
  },
  created() {},
  mounted() {},
  methods: {}
};
</script>

<style scoped lang="scss">
.banner {
  position: relative;
}
.banner_bg {
  content: url("../../assets/image/operatingLoan/banner.png") !important;
  width: 100%;
}

.customer_banner_wrap {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.system-overview_wrapper {
  background-color: $gray_bgc;

  .customer_caption {
    text-align: center;
    padding-top: 40px;
  }
}

/**
移动端样式
 */
@media screen and (max-width: $mobile_width) {
  .banner_bg {
    content: url("../../assets/image/operatingLoan/banner_m.jpg") !important;
    min-height: 200px;
  }
}
</style>
